<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
</head>
<body>

<!--登录模态窗口-->
<form class="modal fade" id="loginForm" tabindex="-1" role="dialog" th:fragment="login"
th:action="@{/userlogin}" th:method="post">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle" th:text="${session.state} == 'fail' ?'用户名或密码错误':'请登录'">请登录</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>

            <div class="modal-body">
                <label class="sr-only">用户名</label>
                <input type="text" name="username" class="form-control" placeholder="用户名" required="" autofocus="">
                <label class="sr-only">密码</label>
                <input type="password" name="password" class="form-control mt-2" placeholder="密码" required="">
                <div class="checkbox mb-3 mt-2">
                    <label>
                        记住我：<input type="checkbox" name="remember-me" value="true"/>
                    </label>
                    <span class="text-success ml-2">第三方登录</span>
                    <a href="#" class="ml-2 oauthLogin"><img src="/assets/img/github.png" style="width: 43px;height: 43px"></a>

                    <a href="#" class="ml-2 oauthQQLogin"><img src="/assets/img/qq.png" style="width: 50px;height: 50px"></a>
                </div>

                <button class="btn btn-lg btn-primary btn-block" type="submit" id="btn-login">登  录</button>
            </div>
        </div>
    </div>
    <div th:if="${session.state}=='fail'" id="loginFail">
    </div>
</form>
</body>
</html>